<!-- 文档 -->
<template>
  <ContentCard>
    <div style="width: 100%">
      <vue-office-pdf :src="fileUrl" v-if="fileSuffix === 'pdf'" />
      <vue-office-docx :src="fileUrl" v-else-if="fileSuffix === 'docx'" />
      <vue-office-excel :src="fileUrl" v-else-if="fileSuffix === 'xlsx'" />
      <a-image v-else :src="fileUrl" />
    </div>
  </ContentCard>
</template>

<script lang="ts" setup>
import VueOfficePdf from '@vue-office/pdf';
import VueOfficeDocx from '@vue-office/docx';
import VueOfficeExcel from '@vue-office/excel';
import { getFileSuffix } from '@/utils/file';

let fileSuffix = ref('');
let fileUrl = ref('');
const route = useRoute();
console.log(route);

const getOpenUrl = () => {
  fileUrl.value = route.query.url;
  fileSuffix.value = getFileSuffix(route.query.url);
  console.log(route.query.url, fileSuffix.value, fileUrl.value);
};

getOpenUrl();
</script>

<style lang="less" scoped></style>
